import React from "react";
//import { Link } from "react-router-dom";
import PageTitle from '../../components/page-title'
import OverList from './OverList'
import { DatabaseOutlined } from '@ant-design/icons'
import MyPagination from '../../components/Pagination'
import { Link } from "react-router-dom";

class Home extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            list: [],
            pageNum: 1,
            total: 200
        };
    }
    componentDidMount() {
        this.loadUserList();
    }
    //发送ax请求
    loadUserList() {
        this.setState({
            list: [
                { TaskNumber: 9, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 8, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 1, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 2, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: '', FailNmber: '', Sessrate: '' },
                { TaskNumber: 9, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 8, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 1, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 2, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: '', FailNmber: '', Sessrate: '' },
                { TaskNumber: 9, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 8, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 1, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 2, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: '', FailNmber: '', Sessrate: '' },
                { TaskNumber: 9, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 8, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 1, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 2, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: '', FailNmber: '', Sessrate: '' },
                { TaskNumber: 9, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 8, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 1, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 2, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: '', FailNmber: '', Sessrate: '' },
                { TaskNumber: 9, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 8, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "正在执行", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 1, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: 110, FailNmber: 30, Sessrate: 23 },
                { TaskNumber: 2, ExecutionSet: 4, ExecutionID: 9, SumNumber: 90, State: "结束", SessNumber: '', FailNmber: '', Sessrate: '' },
            ]

        })
    }
    // 页数发生变化的时候
    onPageNumChange(pageNum) {
        this.setState({
            pageNum: pageNum
        }, () => {
            this.loadUserList();
        });
    }

    render() {
        let listBody = this.state.list.map((doem, index) => {
            return (
                <tr key={index}>
                    <td>{doem.TaskNumber}</td>
                    <td>{doem.ExecutionSet}</td>
                    <td>{doem.ExecutionID}</td>
                    <td>{doem.SessNumber}</td>
                    <td>{doem.State}</td>
                    <td>{doem.SessNumber}</td>
                    <td>{doem.FailNmber}</td>
                    <td>{doem.Sessrate}</td>
                    <td> <Link to='/OverItem'> <DatabaseOutlined /></Link> </td>
                </tr>
            )
        })


        return (
            <div id="page-wrapper">
                <PageTitle title="结果展示" />
                <OverList tableHeads={['执行编号', '执行集', '执行ID', '用例总数', '状态', '成功数', ' 失败数', '成功率', '详情']}>
                    {listBody}
                </OverList>

                <MyPagination
                    defaultCurrent={this.state.pageNum}
                    total={this.state.total}
                    onChange={(pageNum) => this.onPageNumChange(pageNum)} />
            </div>
        )
    }
}



export default Home